<template>
	<div class="pcbody">
		<div class="pcbody2">

			<div class="pcnav">
				<PCNavig></PCNavig>
			</div>

			<div class="pccar">
				<PCCarousel></PCCarousel>
			</div>

			<div class="hotbook">
				<PCHotbook></PCHotbook>
			</div>

		</div>

		<div style="height: 2px; background-color:  #ff4e00; margin-bottom: 2px ; margin-top: 2%;"></div>

		<div>
			<PCNewBook></PCNewBook>
		</div>
	</div>
</template>

<script>
	import PCNavig from '@/components/pcbook/Subassemblies/PCNavig.vue';
	import PCCarousel from '@/components/pcbook/Subassemblies/PCCarousel.vue';
	import PCHotbook from '@/components/pcbook/Subassemblies/PCHotbook.vue';
	import PCNewBook from '@/components/pcbook/Subassemblies/PCNewBook.vue';
	export default {
		name: 'PCBody',
		components: {
			PCNavig,
			PCCarousel,
			PCHotbook,
			PCNewBook,
		},
		data() {
			return {

			}
		}
	}
</script>

<style scoped>
	.pcbody {
		width: 100%;
		height: 100%;
	}
	.pcbody .pcbody2{
		width: 100%;
		height: 100%;
		display: flex;
	}
	.pcbody .pcbody2 .pcnav {
		width: 30%;
	}

	.pcbody .pcbody2 .pccar {
		width: 60%;
	}

	.pcbody .pcbody2 .hotbook {
		width: 30%;
	}
</style>